import Vue from 'vue'
import VueRouter, { RouteConfig } from 'vue-router'
// pages
import Home from '@/views/home.vue'
import Layout from '@/layout/index.vue'
import store from '@/store'

Vue.use(VueRouter)

const routes: Array<RouteConfig> = [
  { name: 'login', path: '/login', component: () => import(/* webpackChunkName: 'loginIndex' */ '@/views/login/index.vue') },

  {
    path: '/',
    component: Layout,
    meta: {
      requireAuth: true
    },
    children: [
      { name: 'home', path: '', component: Home },
      { name: 'role', path: '/role', component: () => import(/* webpackChunkName: 'roleIndex' */'@/views/role/index.vue') },
      {
        name: 'role-alloc-menu',
        path: '/role/:roleId/alloc-menu',
        props: route => ({ id: route.params.roleId }),
        component: () => import(/* webpackChunkName: 'roleAllocMenu' */'@/views/role/allocMenu.vue')
      },
      {
        name: 'role-alloc-resource',
        path: '/role/:roleId/alloc-resource',
        props: route => ({ id: route.params.roleId }),
        component: () => import(/* webpackChunkName: 'roleAllocMenu' */'@/views/role/allocResource.vue')
      },
      { name: 'menu', path: '/menu', component: () => import(/* webpackChunkName: 'menuIndex' */'@/views/menu/index.vue') },
      { name: 'menu-create', path: '/menu/create', component: () => import(/* webpackChunkName: 'menuCreate' */'@/views/menu/create.vue') },
      { name: 'menu-edit', path: '/menu/edit/:id', component: () => import(/* webpackChunkName: 'menuCreate' */'@/views/menu/edit.vue') },
      { name: 'resource', path: '/resource', component: () => import(/* webpackChunkName: 'resourceIndex' */'@/views/resource/index.vue') },
      { name: 'resource-category', path: '/resource-category', component: () => import(/* webpackChunkName: 'resource-category' */'@/views/resource-category/index.vue') },
      { name: 'resource-category-create', path: '/resource-category/create', component: () => import(/* webpackChunkName: 'resource-category' */'@/views/resource-category/create.vue') },
      { name: 'resource-category-edit', path: '/resource-category/edit/:id', component: () => import(/* webpackChunkName: 'resource-category' */'@/views/resource-category/edit.vue') },
      { name: 'course', path: '/course', component: () => import(/* webpackChunkName: 'courseIndex' */'@/views/course/index.vue') },
      { name: 'course-create', path: '/course/create', component: () => import(/* webpackChunkName: 'courseEdit' */'@/views/course/create.vue') },
      { name: 'course-edit', path: '/course/:courseId/edit', component: () => import(/* webpackChunkName: 'courseEdit' */'@/views/course/edit.vue'), props: true },
      { name: 'course-section', path: '/course/:courseId/section', component: () => import(/* webpackChunkName: 'courseEdit' */'@/views/course/section.vue'), props: true },
      { name: 'course-video', path: '/course/:courseId/video', component: () => import(/* webpackChunkName: 'courseEdit' */'@/views/course/video.vue'), props: true },
      { name: 'user', path: '/user', component: () => import(/* webpackChunkName: 'userIndex' */'@/views/user/index.vue') },
      { name: 'adverse', path: '/adverse', component: () => import(/* webpackChunkName: 'adverseIndex' */'@/views/adverse/index.vue') },
      { name: 'adverse-space', path: '/adverse-space', component: () => import(/* webpackChunkName: 'adverseSpaceIndex' */'@/views/adverse-space/index.vue') }
    ]
  },
  { name: 'error-404', path: '/*', component: () => import(/* webpackChunkName: 'error-404' */'@/views/error-page/404.vue') }
]

const router = new VueRouter({
  routes
})
export default router

router.beforeEach((to, from, next) => {
  if (!store.state.user && to.matched.some(({ meta }) => meta.requireAuth)) {
    next({ name: 'login', query: { redirect: to.fullPath } })
  } else {
    next()
  }
})

export function gotoLoginWithRedirect () {
  router.push({
    name: 'login', query: { redirect: router.currentRoute.fullPath }
  })
}
